<template>
  <s-table
    :columns="columns"
    :data-source="dataSource"
    :pagination="pagination"
    :loading="loading"
    @change="handleTableChange"
  >
    <template #bodyCell="{ column, text }">
      <template v-if="column.dataIndex === 'name'">{{ text.first }} {{ text.last }}</template>
      <template v-else>{{ text }}</template>
    </template>
  </s-table>
</template>
<script lang="ts" setup>
  import {
    mouldListApi,
    closeMouldApi,
    deleteMouldApi,
    importMsOrderExcelApi,
    priceTableListApi,
  } from '@/api/sys/msUser';
  import { ref, computed, onMounted, h } from 'vue';
  import { useMessage } from '@/hooks/web/useMessage';
  import { Tag } from 'ant-design-vue';

  onMounted(() => {
    searchFn();
  });

  const columns = [
    {
      title: '型号',
      dataIndex: 'mouldName',
      showOverflow: 'title',
      filters: [{ data: '' }],
      filterRender: {
        name: 'VxeInput',
      },
      width: 140,
    },
    {
      title: '物料名称',
      dataIndex: 'materialName',
      showOverflow: 'title',
      filters: [{ data: '' }],
      filterRender: {
        name: 'VxeInput',
      },
      width: 140,
    },
    {
      title: '物料规格',
      dataIndex: 'specification',
      showOverflow: 'title',
      filters: [{ data: '' }],
      filterRender: {
        name: 'VxeInput',
      },
      width: 140,
    },

    {
      title: '金额',
      dataIndex: 'price',
      align: 'center',
      width: 100,
    },

    {
      title: '供应商名称',
      dataIndex: 'supplierName',
      showOverflow: 'title',
      width: 200,

      filters: [{ data: '' }],
      filterRender: {
        name: 'VxeInput',
      },
    },

    {
      title: '开始日期',
      dataIndex: 'startDate',
      align: 'center',
      // sortable: true,
      width: 100,
    },
    {
      title: '结束日期',
      dataIndex: 'endDate',
      align: 'center',
      // sortable: true,
      width: 100,
    },
    {
      title: '退款条件类别',
      dataIndex: 'returnConditionType',
      align: 'center',
      width: 90,
      slots: {
        default: ({ row }) => {
          const type = row.returnConditionType;
          let text = '';
          switch (type) {
            case 1:
              text = '一次性(数量)';
              break;
            case 2:
              text = '累计(数量)';
              break;
            case 3:
              text = '不退';
              break;
            case 4:
              text = '一次性(金额)';
              break;
            case 5:
              text = '累计(金额)';
              break;
          }
          // return text;
          return h(Tag, null, () => text);
        },
      },
    },
    {
      title: '退款条件数量/金额',
      width: 80,
      field: 'returnConditionNum',
    },
    {
      title: '已累计数量下单数量/金额',
      width: 80,
      field: 'totalNum',
    },
  ];
  const loading = ref(false);
  const dataSource = ref([]);
  function searchFn() {
    loading.value = true;
    mouldListApi({
      page: 1,
      pageSize: 30,
      IfXuNiJian: 1,
    }).then((res) => {
      loading.value = false;
      if (res.code == 200) {
        dataSource.value = res.data.list;
      }
    });
  }
</script>
